<%--
  Created by IntelliJ IDEA.
  User: Aqqqwer
  Date: 2021/7/8
  Time: 14:04
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>生活</title>
</head>
<style type="text/css">
@import "/css/daohang.css";
@import "/css/header.css";
</style>
<script src="/js/jquery-3.4.1.min.js"></script>
<script>

  $(function(){

    $.ajax({
      url:'/sort/all_sort',
      type:'get',
      dataType:'json',
      success:function(jsonData){
        console.info(jsonData);
        if(0!=jsonData.status){
          alert(jsonData.message);
          return;
        }
        //一级分类
        var supSortList=jsonData.data;
        var len=supSortList.length;
        for(var index=0;index<len;index++){
          var navHTML=' <button style="" class="links_button button dropdown"><a href="tuijian.jsp" style="text-decoration: none">?</a><span class="dropdown-content">';
          //一级分类
          var supSort=supSortList[index];
          var supType=supSort.type;
          navHTML=navHTML.replace('?',supType);
          var subSortList=supSort.subSortList;
          var l=subSortList.length;
          for(var j=0;j<l;j++){
            //二级分类
            var subSort=subSortList[j];
            navHTML+='<a href="#">'+subSort.type+'</a>';
          }
          navHTML+='</span></button>';
          $('#topNav').append(navHTML);
        }

      },
      error:function(){
        alert('加载视频分类数据异常');
      }

    });
  });
</script>
<body>
<div class="header_bd">
  <!-- 头部 -->

  <div class="header" >
    <h1><img style="height: 50px;width: 180px"
             src="">
    </h1>
    <form>
      <input type="text" name="search" placeholder="Search.." class="search">
    </form>
    <button class="searchButton searchButton2">立即搜索</button>
    <div class="login"  >
      <!-- 登录 -->
      <!-- 注册 -->
      <span><a href="login_user.jsp" ><input type="button" class="dlspan" value="登 录" /></a></span>&nbsp;&nbsp;
      <span><a href="register_user.jsp" ><input type="button" class="zcspan" value="注 册" /></a></span>
    </div>
  </div>


  <div class="topNav" id="topNav">
    <!-- 导航栏 -->


    </div>
  </div>
</div>
<!-- </div> -->
<div id="content">
  <!-- 内容 -->
    <ul style="list-style: none;">
      <li class="ul_li"><a href="https://www.iqiyi.com/v_19rr7r4y5g.html"><img class="img" src="https://mp2.iqiyipic.com/image/20190210/69/cf/ppc_678773660104_pp_601_1080_675.webp?caplist=jpg,webp" alt="龙猫"></a>
      <p><a title="龙猫">龙猫</a></p>
    </li>
      <li class="ul_li"><a href="https://v.sogou.com/movie/mzuwy3k7gu3tonjrbg5khvhuzx235z5tugyommjqhld37vo7ztwm7qq.html"><img class="img" src="https://img01.sogoucdn.com/v2/thumb/resize/w/258/h/360/t/0/retype/ext/auto/q/75?appid=200839&url=http%3A%2F%2Fimg02.sogoucdn.com%2Fapp%2Fa%2F200803%2Fd0ca77a7d6615ac7b77e334009af8e17" alt="刀剑神域 Alicization篇"></a></p>
    <p><a title="强者天下">强者天下</a></p>
      </li>
    <li class="ul_li"><a href="https://v.sogou.com/series/mnqxe5dpn5xf6nbvgmzdinyjxkr5j5gn6xgnrmpqy2vdcobay7d3btntvtemw.html"><img class="img" src="https://img04.sogoucdn.com/v2/thumb/resize/w/258/h/360/t/0/retype/ext/auto/q/75?appid=200839&url=http%3A%2F%2Fimg03.sogoucdn.com%2Fapp%2Fa%2F100520052%2F8c5728bc52f21f5092ac705414922428" alt="乔巴超人"></a>
      <p><a title="乔巴超人">乔巴超人</a></p>
    </li>
    <li class="ul_li"><a href="https://v.sogou.com/movie/mzuwy3k7gyztcojtbg5khvhuzx235z5tugyommr2w6rmz5nvxk24jq5qz7kq.html"><img class="img" src="https://img04.sogoucdn.com/v2/thumb/resize/w/258/h/360/t/0/retype/ext/auto/q/75?appid=200839&url=http%3A%2F%2Fimg04.sogoucdn.com%2Fapp%2Fa%2F100520052%2F11d176457469e7a2ffe2bae8ea7dc087" alt="发条岛的冒险"></a>
      <p><a title="发条岛的冒险">发条岛的冒险</a></p>
    </li>
    <li class="ul_li"><a href="https://v.sogou.com/movie/mzuwy3k7gyztembsbg5khvhuzx235z5tugyomnj2wg55pz6w4s24jsvfxwrq.html"><img class="img" src="https://img04.sogoucdn.com/v2/thumb/resize/w/258/h/360/t/0/retype/ext/auto/q/75?appid=200839&url=http%3A%2F%2Fimg01.sogoucdn.com%2Fapp%2Fa%2F100520052%2F7616ab6db4d9d12080e3d7b84c294ee5" alt="被诅咒的圣剑"></a>
      <p><a  title="被诅咒的圣剑">被诅咒的圣剑</a></p>
    </li>
    <li class="ul_li"><a href="play_video.jsp"><img src="http://p.xiaomingming.org/FileUpload/20204117511193265.jpg" alt="彼得·格里尔的贤者时间"></a>
      <p><a  title="彼得·格里尔的贤者时间">彼得·格里尔的贤者时间</a></p>
    </li>
    <li class="ul_li"><a href="play_video.jsp"><img src="http://p.xiaomingming.org/FileUpload/20204117511193265.jpg" alt="彼得·格里尔的贤者时间"></a>
      <p><a  title="彼得·格里尔的贤者时间">彼得·格里尔的贤者时间</a></p>
    </li>
    <li class="ul_li"><a href="play_video.jsp"><img src="http://p.xiaomingming.org/FileUpload/20204117511193265.jpg" alt="彼得·格里尔的贤者时间"></a>
      <p><a  title="彼得·格里尔的贤者时间">彼得·格里尔的贤者时间</a></p>
    </li>
    <li class="ul_li"><a href="play_video.jsp"><img src="http://p.xiaomingming.org/FileUpload/20204117511193265.jpg" alt="彼得·格里尔的贤者时间"></a>
      <p><a  title="彼得·格里尔的贤者时间">彼得·格里尔的贤者时间</a></p>
    </li>
      <li class="ul_li"><a href="play_video.jsp"><img src="http://p.xiaomingming.org/FileUpload/20204117511193265.jpg" alt="彼得·格里尔的贤者时间"></a>
        <p><a  title="彼得·格里尔的贤者时间">彼得·格里尔的贤者时间</a></p>
      </li>
  </ul>
</div>

</body>
</html>
